<template>
    <div class="login-wrap">
        <el-form
            :model="ruleForm"
            :rules="rules"
            ref="ruleForm"
            label-width="100px"
            class="demo-ruleForm"
        >
            <div style="width:600px;height:40px;margin-left:34px;margin-bottom:45px">
                <span
                    style="height:40px;line-height:40px;font-size:14px;color:rgba(0,0,0,0.7);width:66px;display:block;float:left"
                >行为类型</span>
                <el-select
                    v-model="ruleForm.behavior_id"
                    filterable
                    placeholder="请选择"
                    style="float:left"
                >
                    <el-option
                        v-for="item in options"
                        :key="item.id"
                        :label="item.name"
                        :value="item.id"
                    ></el-option>
                </el-select>
            </div>

            <el-form-item style="height:70px;" label="姓名" prop="name">
                <el-input v-model="ruleForm.name"></el-input>
            </el-form-item>
            <el-form-item style="height:70px" label="身份证号" prop="card">
                <el-input v-model="ruleForm.card"></el-input>
            </el-form-item>

            <el-form-item style="height:70px" label="积分" prop="integral">
                <el-input v-model="ruleForm.integral"></el-input>
            </el-form-item>

            <el-form-item style="height:70px" label="备注" prop="remark">
                <el-input type="textarea" v-model="ruleForm.remark"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
                <el-button @click="resetForm('ruleForm')">重置</el-button>
            </el-form-item>
        </el-form>
    </div>
</template>

<script>
import Pagination from '@/components/Pagination';
import ajax from '@/utils/myajax';
import $ from 'jquery';
import axios from 'axios';
export default {
    components: { Pagination },
    data() {
        return {
            options: [],
            listQuery: {
                pageNo: 1,
                pageSize: 10
            },
            ruleForm: {
                name: '',
                phone: '',
                integral: '',
                remark: '',
                card: ''
            },
            rules: {
                name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
                bid: [{ required: true, message: '请输入行为类型', trigger: 'blur' }],
                phone: [{ required: true, message: '请输入电话', trigger: 'blur' }],
                integral: [{ required: true, message: '请输入积分数量', trigger: 'blur' }],
                card: [{ required: true, message: '请输入身份证号码', trigger: 'blur' }]
            }
        };
    },
    methods: {
        getTableData1() {
            let me = this;

            ajax('behavior/select_behavior', {}, function(data) {
                me.options = data;
                // console.log(data);
            });
        },
        submitForm(formName) {
            this.$refs[formName].validate(valid => {
                if (valid) {
                    let me = this;
                    if (localStorage.length > 0) {
                        var mydata = localStorage.getItem('id');
                        console.log(mydata);
                        me.ruleForm.cid = Number(mydata);
                        // me.tableData.cid=Number(mydata);
                        // console.log(me.ruleForm.cid,11111111111111)
                    }

                    ajax('behaviorrecord/add_behaviorrecord', this.ruleForm, function(data) {
                        me.$message({
                            title: '成功',
                            message: data,
                            type: 'success'
                        });
                        me.ruleForm.name = '',
                            me.ruleForm.phone = '',
                            me.ruleForm.integral = '',
                        me.ruleForm.behavior_name = '',
                            me.ruleForm.card = '',
                            me.ruleForm.remark = '';
                    });
                }
            });
        },
        resetForm(formName) {
            this.$refs[formName].resetFields();
        }
    },
    created() {
        this.getTableData1();
    }
};
</script>

<style scoped>
.login-wrap {
    position: relative;
    width: 94%;
    height: 650px;
    margin-left: 2%;
    padding-top: 100px;
    padding-left: 50px;
}
</style>